﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SysModules.aspx.cs" Inherits="Sagacity.NC.Web.SysModules" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>系统模块</title>
    <link rel="stylesheet" type="text/css" href="resources/css/main.css" />
    <script type="text/javascript" src="resources/JS/ExampleTab.js"></script>
    <script language="javascript" type="text/javascript">
        function getMenus(moduleId,moduletitlepic) {
            self.parent.openOrCollapseWest(false);
            self.parent.getModulesMenu(moduleId);
            self.parent.updateBodyImg(moduletitlepic);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:HiddenField ID="hidModuleRId" runat="server" Value="1" />
    <div>
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        <ext:Store runat="server" ID="Store1" AutoLoad="true">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="ModuleId" />
                        <ext:RecordField Name="ModuleIcon" />
                        <ext:RecordField Name="ModuleTitlePic" />
                        <ext:RecordField Name="ModuleDesc" />
                        <ext:RecordField Name="ModuleName" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
            <AutoLoadParams>
                <ext:Parameter Name="start" Value="0" Mode="Raw" />
                <ext:Parameter Name="limit" Value="20" Mode="Raw" />
            </AutoLoadParams>
        </ext:Store>
        <div>
            <ext:ViewPort ID="vp1" runat="server">
                <Body>
                    <center>
                        <ext:Panel runat="server" ID="ImagePanel" AutoScroll="true" BodyStyle="overflow-x:hidden;" BodyBorder="false" Border="false" Cls="images-view"
                            Frame="false" Header="false">
                            <Body>
                                <ext:FitLayout ID="FitLayout1" runat="server">
                                    <ext:DataView ID="DataView1" runat="server" StoreID="Store1" AutoShow="true" Height="300" MultiSelect="true"
                                        OverClass="x-view-over" ItemSelector="div.thumb-wrap">
                                        <Template ID="Template1" runat="server">
                                                <tpl for=".">
		                                            <div onclick="javascript:getMenus('{ModuleId}','{ModuleTitlePic}');">	                                                                    
                                                        <dl>                                        
                                                            <div class="thumb-wrap" ext:id="{ModuleId}" ext:title="{ModuleName}">
                                                                <img src={ModuleIcon} title="{ModuleName}" />
                                                                <div>
                                                                    <H4>{ModuleName}</H4>
                                                                    <P>{ModuleDesc}</P>
                                                                </div>                                                               
                                                            </div>
                                                         </dl>
	                                                 </div>
                                                </tpl>
                                        </Template>
                                    </ext:DataView>
                                </ext:FitLayout>
                            </Body>
                        </ext:Panel>
                    </center>
                </Body>
            </ext:ViewPort>
        </div>
        <ext:Window ID="winForm" ShowOnLoad="false" Maximizable="true" Title="系统导航" Icon="Wand"
            Modal="true" runat="server" Height="250" Width="700">
            <AutoLoad Url="" Mode="IFrame">
            </AutoLoad>
            <Listeners>
                <Activate Handler="#{winForm}.maximize();" />
            </Listeners>
        </ext:Window>
        
        <script language="javascript" type="text/javascript">
            Ext.onReady(function(){                
                resetDataViewStyle();
            });
            
            window.onresize = function(){
                resetDataViewStyle();
            }
            
            function resetDataViewStyle(){
                var bodywidth = document.body.clientWidth;
                var bodyheight = document.body.clientHeight;
                try{
                    DataView1.setWidth(bodywidth);
                    DataView1.setHeight(bodyheight);
                }catch(e){}
            }
        </script>
    </div>
    </form>
</body>
</html>